<!DOCTYPE html>
<html lang="en">
<head>
    <title>重复文件</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="static/easyui/themes/default/easyui.css">
    <link href="static/easyui/themes/icon.css" rel="stylesheet" type="text/css"/>
    <link href="static/easyui/demo/demo.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="static/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="static/easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="static/js/main.js"></script>
</head>
<body>
<div class="container">
    <div style="margin-bottom:20px">
        <select class="easyui-combobox" name="state" label="State:" labelPosition="top" style="width:200px;">
            <option value="AL">xxx区块3月份的开采数据.PDF</option>
            <option value="AK">xxx大模型说明文档.txt</option>
            <option value="AZ">延123井注水历史数据表.xlsx</option>
            <option value="AR">AAA区块调研报告.docx</option>
            <option value="CA">xxx地层岩心数据.txt</option>
        </select>
    </div>

    <table id="dg"></table>
    <script type="text/javascript">

        $(function () {
            $("#dg").datagrid({
                title: "资料列表",
                method: "get",
                url: 'json/similar_files.json',
                striped: true,
                pagination: true,
                pageNumber: 1,
                pageList: [2, 5, 10, 20, 30],
                rownumbers: true,
                pagePosition: "bottom",
                columns: [[
                    {field: "ck", checkbox: "true"},
                    {field: "order", title: '序号', width: 100},
                    {field: "filename", title: '文件名', width: 100},
                    {field: "updateTime", title: '上传时间', width: 150},
                    {field: "updateUser", title: '上传用户', width: 100},
                    {field: "filePath", title: '所在文件夹', width: 200},
                    {field: "fileSize", title: '文件大小', width: 100},
                    {field: "tags", title: '标签列表', width: 100},
                    {
                        field: "option", title: '操作', width: 150,
                        formatter: function (value, rowData, index) {
                            return "<a href='javascript:void(0)' onclick='remove(" + rowData.id + ")'>删除   </a>"
                                + "<a href='javascript:void(0)' onclick='toRename(" + rowData.id + ")' >重命名  </a>"
                                + "<a href='javascript:void(0)' onclick='preview(" + rowData.id + ")' >预览  </a>"

                        }
                    }
                ]],
                loadFilter: function (data) {
                    var pager = $('#dg').datagrid('getPager'); // 获取分页器对象
                    var options = pager.pagination('options'); // 获取分页器的选项
                    // 注意：以下代码是客户端分页的示例，但通常不推荐这样做，因为性能问题
                    var start = (options.pageNumber) * options.pageSize;
                    var rows = data.slice(start, start + options.pageSize);
                    console.log({total: data.length, rows: rows})
                    return {total: data.length, rows: rows};

                }
            });
        })
        function remove(id) {
            $.messager.confirm("提示", '确认删除？', function (data) {
                if (data) {
                    $.messager.alert("提示", "删除成功！");
                }
            })
        }

        function toRename(id) {
            $('#dlg-rename').dialog('open');
        }

        function rename() {
            $.messager.alert('提示', '文件名修改成功！');
            $('#dlg-rename').dialog('close');
        }

        function preview(id) {
            window.open('json/data_list.json', '_blank'); // _blank 表示在新的标签页中打开
        }
    </script>
</div>
</body>
</html>